body {
  background-color: #b2ff92;
}

.pencil {
  position: relative;
  width: 50px;
  margin: 50px auto;
  filter: drop-shadow(8px 2px 4px rgba(17, 17, 17, 0.6));
}
.pencil .eraser {
  width: 50px;
  height: 31.25px;
  background: linear-gradient(to left, #975f97, #c19bc1);
  border-radius: 16.6666666667px 16.6666666667px 0 0;
}
.pencil .covered-wood .eraser-holder {
  width: 50px;
  height: 20px;
  background: #dde linear-gradient(0deg, transparent 0%, transparent 20%, black 0%, black 35%, transparent 0%, transparent 42.5%, black 0%, black 57.5%, transparent 0%, transparent 65%, black 0%, black 80%, transparent 0%);
}
.pencil .wooden-part {
  background: linear-gradient(90deg, #cc0000 25%, red 25%, red 50%, #ff6666 0, #ff6666 75%, #ff3333 0);
  width: 50px;
  height: 175px;
  transform: scaleX(-1);
}
.pencil .naked-wood {
  width: 0;
  height: 0;
  position: relative;
  border-top: 70px solid #fbf395;
  border-left: 25px solid transparent;
  border-right: 25px solid transparent;
}
.pencil .naked-wood::before, .pencil .naked-wood::after {
  position: absolute;
  content: "";
  display: block;
  width: 0;
  height: 0;
  border-bottom: 12.5px solid #fbf395;
  border-left: 12.5px solid transparent;
  border-right: 12.5px solid transparent;
  top: -82.5px;
}
.pencil .naked-wood::before {
  left: -25px;
}
.pencil .graphite {
  width: 0;
  height: 0;
  border-top: 35px solid #111;
  position: absolute;
  border-left: 12.5px solid transparent;
  border-right: 12.5px solid transparent;
  left: 12.5px;
  bottom: 0;
}
.pencil .graphite::after {
  content: "";
  position: absolute;
  width: 0;
  height: 0;
  border-top: 35px solid #aaa;
  border-left: 8.3333333333px solid transparent;
  border-right: 0 solid transparent;
  top: -35px;
  left: -8.3333333333px;
}